{extend name="public/list_page"/}
{block name="content"}
<div class="layui-card">
    <div class="layui-card-body">
        <form class="layui-form layui-col-space5" autocomplete="off">
            <div class="layui-inline layui-show-xs-block">
                <input type="text" name="keyword" id="keyword" placeholder="操作人|账号" class="layui-input">
            </div>
            <div class="layui-inline">
                <div class="layui-input-inline">
                    <input type="text" class="layui-input" id="operationDate" placeholder="起始时间" style="width: 300px">
                </div>
            </div>
            <div class="layui-inline layui-show-xs-block">
                <button type="submit" lay-submit="" lay-filter="search" class="layui-btn layui-btn-normal" title="筛选"><i class="layui-icon">&#xe615;</i></button>
                <button type="reset" lay-submit lay-filter="resetDate" class="layui-btn layui-btn-primary" title="重置"><i class="layui-icon">&#xe669;</i></button>
            </div>
        </form>

        <table id="list" lay-filter="test"></table>

    </div>
</div>
{/block}

{block name="custom"}

{/block}

{block name="js"}
<script>
    var startTime = '';
    var endTime = '';
    layui.use(['table','form','laydate'],function () {
        var $ = layui.jquery,
            table = layui.table,
            form = layui.form,
            laydate = layui.laydate;

        //时间选择器
        var layDate = laydate.render({
            elem:'#operationDate',
            type:'datetime',
            range:true,
            done:function (value, date, endDate) {
                startTime = date;
                endTime = endDate
                // console.log(value); //得到日期生成的值，如：2017-08-18
                // console.log(date); //得到日期时间对象：{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
                // console.log(endDate); //得结束的日期时间对象，开启范围选择（range: true）才会返回。对象成员同上。
            }
        });

        //数据表格
        var Table = table.render({
            elem:"#list",
            method:"POST",
            url:"{:url('system/log')}",
            response:{
                statusCode:'suc'
            },
            page:true,
            limits:[10,20,50,100,200,500,1000],
            cols:[[
                {field:'id',title:'序号',width:100},
                {field:'name',title:'操作人'},
                {field:'username',title:'账号'},
                {field:'content',title:'操作内容'},
                {field:'create_time',title:'时间'}
            ]],
        });

        //监听提交
        form.on('submit(search)',function (data) {
            let start = null;
            let end = null;
            if (startTime.length !== 0){
                start = startTime.year + '-' + startTime.month + '-' + startTime.date + ' ' + startTime.hours + ':' + startTime.minutes + ':' + startTime.seconds
                end = endTime.year + '-' + endTime.month + '-' + endTime.date + ' ' + endTime.hours + ':' + endTime.minutes + ':' + endTime.seconds
            }

            //重载表格
            Table.reload({
                where:{
                    start_time:start,
                    end_time:end,
                    keyword:data.field.keyword
                },
                page:{
                    curr:1
                }
            });
            return false
        });

        //重置时间
        form.on('submit(resetDate)',function () {
            startTime = null;
            endTime = null;
        });
    });
</script>
{/block}